<template>
  <el-container>
    <el-header height="60px">
      <header-contain>
        <a href="#" slot="log">
          <img src="/static/imgs/log.png" height="60" width="180" >
        </a>
        <header-menu slot="menu"></header-menu>
<!--        <header-el-menu slot="menu"></header-el-menu>-->
        <header-user slot="myUser"></header-user>
      </header-contain>
    </el-header>
    <el-main>
      <my-index-main>
        <my-index-maxshow slot="maxShow" :max-show="this.maxShow"></my-index-maxshow>
        <my-index-newshow slot="newShow" :blogs="this.blogs"></my-index-newshow>
        <my-index-usershow slot="userShow" :usershow="this.userShow"></my-index-usershow>
        <my-index-hot-blogs slot="hotBlogs" :hot-blogs="this.hotBlogs" ></my-index-hot-blogs>
      </my-index-main>
    </el-main>
  </el-container>
</template>

<script>
import tabbar from "../components/content/tabbar";
import headerContain from "../components/content/header/headerContain";
import headerMenu from "../components/content/header/headerMenu";
import headerElMenu from "../components/content/header/headerElMenu";
import headerUser from "../components/content/header/headerUser";
import myIndexMain from "../components/content/main/myIndexMain";
import myIndexMaxshow from "../components/content/main/myIndexMaxshow";
import myIndexNewshow from "../components/content/main/myIndexNewshow";
import myIndexHotBlogs from "../components/content/main/myIndexHotBlogs";
import {getHomeMultidate} from '../netword/home'
import MyIndexUsershow from "../components/content/main/myIndexUsershow";


export default {
  name: "index",
  components: {
    MyIndexUsershow,
    tabbar,headerContain,headerMenu,myIndexMain,myIndexMaxshow,myIndexNewshow
    ,myIndexHotBlogs,headerElMenu,headerUser
  },
  props: {
    // img,time,category,title,contail
    // blogs: []
  },
  data() {
    return {
      blogs: null,
      userShow: null,
      hotBlogs: null,
      maxShow: null,
    }
  },
  created() {
    //1、请求多个数据
    getHomeMultidate().then(res => {
      this.blogs = res.dependencies.blogs;
      this.userShow = res.dependencies.usershow;
      this.hotBlogs = res.dependencies.hotBlogs;
      this.maxShow = res.dependencies.maxShow;
    })
  }
}



</script>

<style scoped>
  .el-container {
    margin: auto;
    max-width: 1600px;
    min-width: 1000px;
  }
</style>

